<template>
    <div class="box">
        <div class="top">
            <van-nav-bar title="标题" left-text="返回" left-arrow @click-left="$router.go(-1)" />
        </div>
        <div class="content">
<div>
    <img :src="list1.image" alt="">
</div>
<p>{{ list1.title }}</p>
<p>{{ list1.price }}</p>
        </div>
<footer>
    <van-action-bar>
  <van-action-bar-icon icon="chat-o" text="客服" dot />
  <van-action-bar-icon icon="cart-o" text="购物车" badge="5" @click="$router.push('/shop')"/>
  <van-action-bar-icon icon="shop-o" text="店铺" badge="12" />
  <van-action-bar-button type="warning" text="加入购物车"  @click="dj" />
  <van-action-bar-button type="danger" text="立即购买" />
</van-action-bar>
</footer>
    </div>


</template>
<script setup>
import request from '@/utils/request'
import { useRoute } from 'vue-router'
import { ref, onMounted } from 'vue'
import { useCounterStore } from '@/stores/counter'
// 可以在组件中的任意位置访问 `store` 变量 ✨
const store = useCounterStore()
const list1 = ref({})
const route = useRoute()

onMounted(() => {
    request.get('/detail', {
        params: { 
            id:route.params.id
         }

    }).then(res => {
        if (res.data.code == 200) {
            console.log(res.data.data);
            list1.value = res.data.data
        }
    })
})
const dj=()=>{
    store.add(list1.value)
}


</script>
<style lang="scss">

</style>